
<app-input field="clientId" [change]="service" [orig]="original">
  <mat-form-field class="textInput">
    <mat-placeholder i18n-placeholder="services.form.label.oauthClientId">
      {{ messages.services_form_label_oauthClientId }}
    </mat-placeholder>
    <input matInput required [(ngModel)]="service.clientId">
  </mat-form-field>
  <mat-hint align="end">
    <app-hint></app-hint>
  </mat-hint>
  <mat-icon appHelp
           i18n-matTooltip="services.form.tooltip.oauthClientId"
           [matTooltip]="messages.services_form_tooltip_oauthClientId">
  </mat-icon>
</app-input>

<app-input field="clientSecret" [change]="service" [orig]="original">
  <mat-form-field class="textInput">
    <mat-placeholder i18n-placeholder="services.form.label.oauthClientSecret">
      {{ messages.services_form_label_oauthClientSecret }}
    </mat-placeholder>
    <input matInput required [type]="showOAuthSecret ? 'text' : 'password'"
           [(ngModel)]="service.clientSecret">
  </mat-form-field>
  <mat-hint align="end">
    <app-hint></app-hint>
  </mat-hint>
  <mat-icon appHelp
           i18n-matTooltip="services.form.tooltip.oauthClientSecret"
           [matTooltip]="messages.services_form_tooltip_oauthClientSecret">
  </mat-icon>
</app-input>

<div>
  <mat-checkbox [(ngModel)]="showOAuthSecret">
    <ng-container i18n="services.form.label.oauthShowSecret">
      {{ messages.services_form_label_oauthShowSecret }}
    </ng-container>
    <mat-icon style="font-size: medium"
             i18n-matTooltip="services.form.tooltip.oauthShowSecret"
             [matTooltip]="messages.services_form_tooltip_oauthShowSecret">help
    </mat-icon>
  </mat-checkbox>
</div>

<app-input field="bypassApprovalPrompt" [change]="service" [orig]="original">
  <mat-checkbox [(ngModel)]="service.bypassApprovalPrompt">
    <ng-container i18n="services.form.label.oauthBypass">
      {{ messages.services_form_label_oauthBypass }}
    </ng-container>
    <mat-icon appHelp
             i18n-matTooltip="services.form.tooltip.oauthBypass"
             [matTooltip]="messages.services_form_tooltip_oauthBypass">
    </mat-icon>
    <mat-hint align="end">
      <app-hint></app-hint>
    </mat-hint>
  </mat-checkbox>
</app-input>

<app-input field="generateRefreshToken" [change]="service" [orig]="original">
  <mat-checkbox [(ngModel)]="service.generateRefreshToken">
    <ng-container i18n="services.form.label.oauthRefreshToken">
      {{ messages.services_form_label_oauthRefreshToken }}
    </ng-container>
    <mat-icon appHelp
             i18n-matTooltip="services.form.tooltip.oauthRefreshToken"
             [matTooltip]="messages.services_form_tooltip_oauthRefreshToken">
    </mat-icon>
    <mat-hint align="end">
      <app-hint></app-hint>
    </mat-hint>
  </mat-checkbox>
</app-input>

<app-input field="jsonFormat" [change]="service" [orig]="original">
  <mat-checkbox  [(ngModel)]="service.jsonFormat">
    <ng-container i18n="services.form.label.oauthJsonFormat">
      {{ messages.services_form_label_oauthJsonFormat }}
    </ng-container>
    <mat-icon appHelp
             i18n-matTooltip="services.form.tooltip.oauthJsonFormat"
             [matTooltip]="messages.services_form_tooltip_oauthJsonFormat">
    </mat-icon>
    <mat-hint align="end">
      <app-hint></app-hint>
    </mat-hint>
  </mat-checkbox>
</app-input>
